<template>
  <div class="container">
    <el-dialog
      title="编辑退货单"
      :visible.sync="dialog.centerDialogVisible"
      @open="openData"
      @close="cancel"
      center
      width="99%"
    >
      <el-table
        :data="tableData"
        border
        max-height="500"
        style="width: 100%"
        empty-text="暂无数据"
      >
        <el-table-column
          prop="productname"
          label="商品名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="productcode"
          label="商品编码"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="unit"
          label="单位"
          align="center"
        ></el-table-column>
        <el-table-column label="箱规格" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.boxspec"
            ></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="箱数" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.boxqty"
            ></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="数量" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.qty"
            ></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="成本价" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.cost"
            ></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="退货价" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.price"
            ></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="入库价" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.inp_price"
            ></el-input-number>
          </template>
        </el-table-column>

        <el-table-column label="供应商" align="center" width="150px">
          <template slot-scope="scope">
            <el-select
              :multiple="false"
              filterable
              remote
              center
              reserve-keyword
              v-model="scope.row.supplier_name"
              placeholder="请选择供应商"
              :remote-method="supplierRemoteMethod"
              :loading="supplier.loading"
              @change="getSupplier(scope)"
            >
              <el-option
                v-for="item in supplier.options"
                :key="item.id"
                :label="item.label"
                :value="item.label"
              ></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="采购员" align="center" width="150px">
          <template slot-scope="scope">
            <el-select
              :multiple="false"
              filterable
              remote
              center
              reserve-keyword
              v-model="scope.row.buyer"
              placeholder="请选择采购员"
              :remote-method="purchaseRemoteMethod"
              :loading="purchase.loading"
              @change="getPurchase(scope)"
            >
              <el-option
                v-for="item in purchase.options"
                :key="item.id"
                :label="item.label"
                :value="item.label"
              ></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="溢折" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.spillfoldvalue"
            ></el-input-number>
          </template>
        </el-table-column>

        <el-table-column label="调货提成" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.allocateprice"
            ></el-input-number>
          </template>
        </el-table-column>

        <el-table-column label="预提费" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.profitvalue"
            ></el-input-number>
          </template>
        </el-table-column>

        <el-table-column label="筐提成" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number
              size="small"
              :controls="false"
              v-model="scope.row.packagingboxprofitvalue"
            ></el-input-number>
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  getOrgData,
  addSaleOrder,
  selectGoodsBatch,
  updata,
} from "@/api/middleorder/middleorderlist";
import { details } from "@/api/middleorder/middleorderlist";
import { getList } from "@/api/putStorage/putStotageList"; //采购员  key: ""limit: 1000
import { supplierList } from "@/api/supplier/supplierList"; //供应商 code: ""  limit: 1000  name: ""
import { selectRdcData } from "@/api/select/select"; //page: 1,  limit: 500, code_or_name: this.search.selectnamecode,配送中心
import { commodityList } from "@/api/commodity/commodityList"; //商品
import { getToken } from "@/utils/auth";
import { Loading } from "element-ui";
export default {
  props: {
    dialog: Object,
  },
  data() {
    return {
      tableData: [],
      commodity: "",
      supplier: {
        options: [],
        value: "",
        list: [],
        loading: false,
      },
      purchase: {
        options: [],
        value: "",
        list: [],
        loading: false,
      },

      ispici: false,
      isnum: false,
      OrgDatalist: [],
      dtDatalist: [],
      search: {
        goods_code: "",
        org_code: "",
        ps_code: "",
      },
      organization: "",
      psanization: "",
      priceNum: 0,
      ppinfo: "",
    };
  },
  methods: {
    //取消
    cancel() {
      this.dialog.centerDialogVisible = false;
      this.is_assign = false;
      this.commodity = "";
      this.organization = "";
      this.psanization = "";
      this.tableData = [];
      this.ispici = false;
      this.isnum = false;
      this.OrgDatalist = [];
      this.dtDatalist = [];
      this.search = {
        goods_code: "",
        org_code: "",
        ps_code: "",
      };
      this.supplier = {
        options: [],
        value: "",
        list: [],
        loading: false,
      };
      this.purchase = {
        options: [],
        value: "",
        list: [],
        loading: false,
      };
      ppinfo: "";
    },

    getData() {
      this.tableData = [];
      this.center = [];
      let data = {
        id: this.dialog.id,
      };
      details(data).then((res) => {
        if (res.code == 0) {
          this.ppinfo = res.data.info;
          this.tableData = res.data.son;
        }
      });
    },
    openData() {
      this.getData();
      this.openSupplie();
      this.purchaseList();
    },
    //获取供应商
    openSupplie(name = "") {
      let data = {
        page: 1,
        limit: 500,
        name: name,
      };
      supplierList(data).then((res) => {
        this.supplier.options = res.data.data.map((item) => {
          return {
            value: item.id,
            label: item.name,
            code: item.code,
          };
        });
      });
    },
    //获取采购
    purchaseList(name = "") {
      let data = {
        page: 1,
        limit: 500,
        key: name,
      };
      getList(data).then((res) => {
        this.purchase.options = res.data.map((item) => {
          return {
            value: item.id,
            label: item.name,
            code: item.code,
          };
        });
      });
    },
    //搜索供应商
    supplierRemoteMethod(query) {
      if (query !== "") {
        this.openSupplie(query);
      } else {
        this.supplier.options = [];
      }
    },
    getSupplier(scope) {
      let supplier = this.supplier.options.filter((res) => {
        return res.label == scope.row.supplier_name;
      });
      this.tableData[scope.$index].supplier_id = supplier[0].value;
      this.tableData[scope.$index].supplier_name = supplier[0].label;
      this.tableData[scope.$index].supplier_code = supplier[0].code;
      console.log(this.tableData);
    },
    purchaseRemoteMethod(query) {
      if (query !== "") {
        this.purchaseList(query);
      } else {
        this.purchase.options = [];
      }
    },
    getPurchase(scope) {
      let purchase = this.purchase.options.filter((res) => {
        return res.label == scope.row.buyer;
      });
      this.tableData[scope.$index].purchaseId = purchase[0].value;
      this.tableData[scope.$index].buyer = purchase[0].label;
      this.tableData[scope.$index].buyer_code = purchase[0].code;
      console.log(this.tableData);
    },
    //确定
    confirm() {
      let arr = [];
      this.tableData.forEach((res) => {
        arr.push({
          id: res.id,
          boxspec: res.boxspec,
          boxqty: res.boxqty,
          qty: res.qty,
          cost: res.cost,
          price: res.price,
          inp_price: res.inp_price,
          spillfoldvalue: res.spillfoldvalue,
          allocateprice: res.allocateprice,
          profitvalue: res.profitvalue,
          packagingboxprofitvalue: res.packagingboxprofitvalue,
          buyer: res.buyer,
          buyer_code: res.buyer_code,
          unit: res.unit,
          supplier_id: res.supplier_id,
          supplier_name: res.supplier_name,
          supplier_code: res.supplier_code,
        });
      });

      let data = {
        dcid: this.ppinfo.dcid,
        dccode: this.ppinfo.dccode,
        dcname: this.ppinfo.dcname,
        orgid: this.ppinfo.orgid,
        orgcode: this.ppinfo.orgcode,
        orgname: this.ppinfo.orgname,
        id: this.dialog.id,
        goods: JSON.stringify(arr),
      };
      // console.log(data, 999);

      updata(data).then((res) => {
        if (res.code == 0) {
          this.$message({
            type: "success",
            message: res.msg || res.message,
          });
          this.$emit("upData");
          this.cancel();
        }
      });
    },
  },
};
</script>
<style scoped>
.pagination {
  text-align: right;
  padding: 10px;
}
.top {
  margin-bottom: 5px;
}
</style>
